/* =============================  文字  ============================== */
.text-cut {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.text-black {
  color: #333333;
}

.text-grey {
  color: #818181;
}

.text-grey-light {
  color: #F5F5F5;
}


.text-red {
  color: #FF807D;
}

.text-white {
  color: #FFFFFF;
}

.text-blue {
  color: #4F9BFA;
}

.text-xs {
  font-size: 24rpx;
}

.text-sm {
  font-size: 28rpx;
}

.text-32 {
  font-size: 32rpx;
}

.text {
  font-size: 34rpx;
}

.text-large {
  font-size: 40rpx;
}

.text-bold {
  font-weight: 700;
}

.fw-500 {
  font-weight: 500;
}

.fw-600 {
  font-weight: 600;
}

/* =============================  布局  ============================== */
.flex {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.flex-column {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.justify-content__center {
  justify-content: center;
}

/* =============================  边距  ============================== */
.margin-right {
  margin-right: 32rpx;
}

.mr-16 {
  margin-right: 16rpx;
}

.mr-24 {
  margin-right: 24rpx;
}

.mt-16 {
  margin-top: 16rpx;
}

.mt-28 {
  margin-top: 28rpx;
}

.margin-left {
  margin-left: 32rpx;
}
.margin-top {
  margin-top: 32rpx;
}
.margin-bottom {
  margin-bottom: 32rpx;
}
.margin-right-sm {
  margin-right: 8rpx;
}

.margin-bottom-sm {
  margin-bottom: 16rpx;
}

.pb-28 {
  padding-bottom: 28rpx;
}

/* =============================  背景  ============================== */

.bg-theme {
  background-color: #A5CAF1;
}

.bg-white {
  background-color: #FFFFFF;
}

.bg-red {
  background-color: #FF807D;
}

.bg-grey {
  background-color: #F5F5F5;
}

/* =============================  动画  ============================== */

@keyframes fadeIn {
  0% {
      opacity: 0;
  }
  100% {
      opacity: 1;
  }
}

.anic-300ms {
  animation-duration: 300ms;
}

.anic-400ms {
  animation-duration: 400ms;
}

.anic-500ms {
  animation-duration: 500ms;
}

.anic-600ms {
  animation-duration: 600ms;
}

.anic-1s {
  animation-duration: 1000ms;
}

.ani-fadein {
  animation-name: fadeIn;
}